<template>
    <div id="hotCenter_hwzx_zccl_" class="container-fluid">
        <table class="layui-hide" id="zccl" lay-filter="zccl"></table>
        <script type="text/html" id="bar">
          <div class="el-button--success el-button el-button--mini is-round" lay-event="edit" >处理</div>
          <div class="el-button--danger el-button el-button--mini is-round" lay-event="del" >删除</div>
        </script>
        <div id="khxx" class="padding" style="display: none;">
            <v-khxx v-bind:shadeClose="shadeClose" v-bind:shadeOpen="shadeOpen" v-bind:searhDatas="searhDatas" v-bind:searhDatas_="searhDatas_"  v-bind:params="params"></v-khxx>
        </div>
    </div>
</template>

<script>
    import khxx from "../hwzx/khxx.vue"
    import {formatDateTime} from '../../../../common/js/util';
    export default {
        props: ['cx_','zccl_','params'],
        components:{
            'v-khxx':khxx,
        },
        name: "index",
        watch:{
            cx_:function () {//cx_改变了就表示需要刷新界面
                //查找暂存处理列表
                layui.use('table', ()=>{//加这个是防止刷新的时候会出现不存在render方法
                    this.$cache_.layuiCachedTable(this,{
                        elem: "#zccl"
                        , url: burl + 'crm-hot-center-zccl/list' //数据接口
                        , toolbar: '#default' //开启工具栏，此处显示默认图标，可以自定义模板，详见文档
                        , title: ''
                        , where:{CrmHwzxZcclSearch:this.$parent.params}
                        , method:"post"
                        , height: 500
                        , cols: [this.header]
                        , page: true //开启分页
                    });
                    //监听行工具事件
                    layui.table.on('tool(zccl)', (obj)=>{
                        //查询到相对于的文件
                        switch(obj.event) {
                            case 'edit':
                                this.shadeOpen = !this.shadeOpen;//开启编辑页面的遮罩
                                this.searhDatas = !this.searhDatas;//编辑页面进行搜索数据
                                this.params.id = obj.data.id;
                                this.params.ldhm = obj.data.ldhm;
                                this.$parent.operation.zccl = true;//修改父亲的状态
                                this.$parent.params.other_id = "hwzx_zccl"+"="+obj.data.id;
                                this.$parent.lsjlyddRefresh = !this.$parent.lsjlyddRefresh;//历史记录刷新
                                this.searhDatas_ = obj.data;
                                //编辑页面页面层
                                allIndex = layer.open({
                                    type: 1,
                                    skin: 'layui-layer-rim', //加上边框
                                    area: ['70%','70%'], //宽高
                                    offset:"r",
                                    close: true,
                                    shade: 0,
                                    maxmin: true,
                                    content:$("#khxx"),
                                    end: ()=>{//关闭隐藏
                                        this.$parent.operation.zccl = false;
                                        this.$parent.operation.bc = false;
                                        this.$parent.operation.cx = true;
                                    }
                                });
                                break;
                            case 'del':
                                layer.confirm("确认是否删除该文件！",function () {
                                    this.$post('crm-hot-center-zccl/delete?id='+obj.data.id,{})
                                        .then((response) => {//这里使用了ES6的语法
                                            if (response.data.res == 1) {//成功
                                                layer.msg("删除成功！",{icon:1})
                                                obj.del()
                                            }else{//失败
                                                layer.msg("删除失败！"+response.data.data[0],{icon:2})
                                            }
                                        }).catch((response) => {
                                        layer.msg("错误！",{icon:2})
                                    });
                                });
                                break;
                        }
                    });
                    //行点击事件
                    layui.table.on('row(zccl)', (obj)=>{
                        noCheckCache = true;
                        this.$parent.params.other_id = "hwzx_zccl"+"="+obj.data.id;//拿到 唯一的id
                        this.$parent.lsjlyddRefresh = !this.$parent.lsjlyddRefresh;//刷新历史记录与订单
                    });
                });
            },
            zccl_:function () {//zccl_改变了就表示需要刷新界面
                this.shadeClose = !this.shadeClose;
            },
        },
        data: function () {
            return {
                shadeOpen:false,//遮罩开启
                shadeClose:false,//遮罩关闭
                searhDatas:false,//刷新话务中心
                zcclDatas:{},
                header:[//列表的头
                    {field: 'id',  title: '序列号', sort: true, fixed: 'left',width:150}
                    , {field: 'ldhm', title: '来电号码', sort: true,width:150}
                    , {field: 'bh', title: '编号',sort: true,width:150}
                    , {field: 'zzjxsj', title: '最早进线时间',sort: true,width:240,templet:function(res){
                        return formatDateTime(res.zzjxsj);
                    }}
                    , {field: 'ldzcsj', title: '来电暂存时间',sort: true,width:240,templet:function(res){
                        return formatDateTime(res.ldzcsj);
                    }}
                    , {field: 'dhfsj', title: '待回访时间',sort: true,width:240,templet:function(res){
                        return formatDateTime(res.dhfsj);
                    }}
                    , {field: 'khmc', title: '客户名称', sort: true,width:150}
                    , {field: 'khxb', title: '性别', sort: true,width:80,templet:(res)=>{return res.khxb=='1'?'男':'女';}}
                    , {field: 'dhhm', title: '电话号码', sort: true,width:120}
                    , {field: 'gtnr', title: '沟通内容', sort: true,width:120}
                    , {field: 'zxcp', title: '质询产品', sort: true,width:120}
                    , {field: 'bz', title: '备注', sort: true,width:150}
                    , {field: 'username', title: '归属员', sort: true,width:120}
                    , {field: 'yggh', title: '归属员工号', sort: true,width:120}
                    , {field: 'khzl', title: '客户质量', sort: true,width:120}
                    , {fixed: 'right',title: '操作',width: 205,align:'center',templet:"#bar"}
                ],
                searhDatas_:"",
                index:"",
            }
        },
    }
</script>